// header
header{
  padding: 20px 0;
  background-color: #f7f7f7;
  .container{
    .title{
      img{
        width: 100%;
      }
    }
  }
}
// main
main{
  background-color: #f7f7f7;
  .appraisal{
    .container{
      border: 1px solid #edeef0;
      background-color: #fff;
      margin: 0 auto 20px;
      border-radius: 4px;
      display: flex;
      padding: 10px 0;
      .left{
        width: 10%;
        height: 90px;
        position: relative;
        padding: 20px 0;
        img{
          position: absolute;
          left: 50%;
          top: 50%;
          transform: translate(-50%,-50%);
        }
      }
      .right{
        width: 89%;
        height: 90px;
        padding: 20px 20px 20px 10px;
        h3{
          font-size: 1.2rem;
          span{
            margin-left: 10px;
            font-weight: normal;
            font-size: 0.8rem;
            color: #666;
          }
        }
        p{
          padding: 10px 0 ;
          color: #555;
        }
        .rightBottom{
          display: flex;
          justify-content: space-between;
          .box{
            font-size: 0.9rem;
            .el-button{
              border-radius: 20px;
              overflow: hidden;
              padding: 7px 20px;
            }
          }
        }
      }
    }
  }
  .autognosis{
    .container{
      display: block;
      background-color: #fff;
      .top{
        padding: 20px;
        .title{
          font-size: 1.3rem;
          padding: 4px 0;
        }
        p{
          color: #555;
          font-size: 0.9rem;
          padding: 3px 0;
        }
      }
      .bottom{
        padding: 10px 0;
        .testList{
          display: flex;
          justify-content: space-around;
          //border: 1px solid blue;
          height: 200px;
          padding: 20px 0;
          .testBOX{
            width: 25%;
            .test{
              height: 140px;
              position: relative;
              a{
                display: block;
                width: 100%;
                height: 100%;
              }
              .testBg{
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
              }
              .testBox{
                position: absolute;
                top: 50%;
                left: 50%;
                transform: translate(-50%,-50%);
                width: 94%;
                height: 90%;
                background-size: cover;
                background-repeat: no-repeat;
                p{
                  width: 100%;
                  position: absolute;
                  right: 0;
                  bottom: 0;
                  background-color: rgba(60, 63, 65,0.2);
                  text-align: right;
                  span{
                    color: #fff;
                    padding-right: 10px;
                  }
                }
              }
            }
            .test:hover{
              .testBg{
                background-color: rgba(0,0,0,0.4);
              }
            }
            .textP{
              padding: 10px 20px;
              span{
                display: block;
                color: #555;
                font-size: 0.9rem;
              }
            }
          }
        }
      }
    }
  }
}